<%@ page language="java" contentType="text/html;charset=UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = path + "/resource/extjs/skins/default";
%>
<html>
	<head>
		<jsp:include page="/common.jsp" />
		<!-- include common.jsp -->
		<base />
		<script type="text/javascript">
			var rightAreaId='<%=request.getParameter("rightAreaId")%>' ;
		</script>
		<link rel="stylesheet" href="<%=path%>/resource/MultiSelect.css" type="text/css" />
		<script type="text/javascript" src="<%=path%>/resource/MultiSelect.js"></script>
		<script type="text/javascript" src="<%=path%>/resource/ItemSelector.js"></script>
		
		<script type="text/javascript">
		var basePath='<%=basePath%>';
		var path='<%=path%>';
		var form_update_right_area;
		var tree=window.parent.Ext.getCmp("moduleTree");
		function updateRightArea(){
			form_update_right_area.getForm().submit({
				url:path+'/module/updateRightArea.do',
				waitMsg:'load...',
				success:function(){
				tree.root.reload();
				}	
			})
		}
	    Ext.onReady(function(){
	    var store_available = new Ext.data.ArrayStore({
	        fields: ['value','text'],
	        sortInfo: {
	            field: 'value',
	            direction: 'ASC'
	        }
	    });
	    var store_selected = new Ext.data.ArrayStore({
	        fields: ['value','text'],
	        sortInfo: {
	            field: 'value',
	            direction: 'ASC'
	        }
	    });
    	form_update_right_area = new Ext.form.FormPanel({
				border : false,
				renderTo:'updateRightArea',
				frame:true,
				border:false,
				width:450,
				defaultType: 'textfield',
				bodyStyle:'padding:10px 5px 0 20px',
				defaults: {width: 230},
				reader:new Ext.data.JsonReader({
					root:'data',
					successProperty:'success'
				},[
						{name: 'rightAreaId',mapping:'rightAreaId'},
				        {name: 'areaName',mapping:'areaName'},
				        {name: 'areaDesc',mapping:'areaDesc'},
				        {name: 'displayOrder',mapping:'displayOrder'},
				        {name: 'state',mapping:'state'}
				    ]),
				items : [{
						hidden:true,
						name:"rightAreaId"
					},{
		    			fieldLabel: '模块名称',
		    			name: 'areaName',
		    			allowBlank:false
		    		},{	
		    			fieldLabel: '描述',
		    			name: 'areaDesc'
		    		},{
		    			fieldLabel: '顺序',
		    			name: 'displayOrder'
		    		},{
		            	xtype: 'radiogroup',
			            fieldLabel: '激活',
			            name:'state',
			            allowBlank:false,
			            items: [
			                {boxLabel: '是', name: 'state', inputValue: 1},
			                {boxLabel: '否', name: 'state', inputValue: 0}
			            ]
		       		},{
			            xtype: 'itemselector',
			            name: 'itemselector',
			            width:450,
			            fieldLabel: '二级分类',
			            autoScroll:true,
				        imagePath: path+'/resource/MultiSelect/images/',
			            multiselects: [{
			                width: 150,
			                height: 200,
			                
			                store: store_available,
			                displayField: 'text',
			                valueField: 'value'
			            },{
			                width: 150,
			                height: 200,
			                store: store_selected,
			                displayField: 'text',
			                valueField: 'value',
			                tbar:[{
			                    text: '清空',
			                    handler:function(){
				                    form_update_right_area.getForm().findField('itemselector').reset();
				                }
			                }]
			            }]
			        }],
		            buttons:[{
		            	text:'修改',
		            	handler:updateRightArea
				}]
			});
			form_update_right_area.getForm().load({
				url:path+"/module/loadRightArea.do",
				params:{"rightAreaId":rightAreaId}
			});
			Ext.Ajax.request({
				url:path+'/classify/loadAllSCByRightArea.do',
				params:{"rightAreaId":rightAreaId},
				success:function(str){
					var str=Ext.util.JSON.decode(str.responseText);
					store_available.loadData(str.available);
					store_selected.loadData(str.selected);
				}
			});
		});
		</script>
	</head>
	<body>
		<style>
			body {
			margin: 0;
			padding: 0 0 12px 0;
			font-size: 12px;
			line-height: 22px;
			font-family: "宋体", "Arial Narrow";
			background: #fff;
		}
		</style>
		<div id="updateRightArea">
		</div>
	</body>
</html>
